fix: share-link first visit doesn't open anchor modal (#470) by raifdmueller · Pull Request #474 · LLM-Coding/Semantic-Anchors

raifdmueller · 2026-05-13T19:03:58Z

Closes #470

Summary

When opening a share-link like `/#/anchor/` in a fresh tab, the homepage was rendered instead of the anchor modal. On a second visit the modal already existed and the link worked — making the bug look intermittent.

Root cause

`router.handleRoute()` invoked `showAnchorDetails()` before `initApp`'s `createModal()` microtask ran. `loadAnchorContent()` then crashed inside the dynamic-import callback with:

```
TypeError: Cannot read properties of null (reading 'querySelector')
at loadAnchorContent (anchor-modal.js:164)
```

The modal element didn't exist yet, the URL got rewritten to `/anchor/...` by the SPA's hash→path migration, the title was set correctly, but no modal opened.

Fix

Guard `showAnchorDetails()` by calling the idempotent `createModal()` when the element is missing. Cheap, defensive, no behavioral change on the happy path.

Test plan

Regression test added: `anchor-modal.test.js` — removes the modal element, calls `showAnchorDetails`, asserts it doesn't throw, the modal is created, and the `hidden` class is removed
Full unit test suite passes (90/90)
Production build verified with Playwright against `http://localhost:4173/Semantic-Anchors/#/anchor/plain-english-strunk-white\`:
- Modal opens (`display: flex`)
- Title rendered: "Plain English according to Strunk & White"
- Content loaded (2185 chars)
- Zero console errors

🤖 Generated with Claude Code

Summary by CodeRabbit

Bug Fixes

Behoben: Das Anker-Detailfenster wird nun zuverlässig angezeigt, auch wenn es unter bestimmten Bedingungen aufgerufen wird.

Both are local-only directories (Python virtualenv and LinkedIn skill cache) that shouldn't be tracked.

…M-Coding#470) When a user opens a share-link like /#/anchor/<slug> in a fresh tab, the router's handleRoute() called showAnchorDetails() before initApp's createModal() microtask had a chance to run. loadAnchorContent then crashed with "Cannot read properties of null (reading 'querySelector')", leaving the modal element missing and the homepage visible underneath. On a second visit the modal already existed in the DOM, so the bug appeared as "works on second click." Guard showAnchorDetails by calling the idempotent createModal() when the element is missing. Add a regression test that removes the modal element before calling showAnchorDetails and asserts the modal is created and opened. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

coderabbitai · 2026-05-13T19:04:11Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yml

Review profile: CHILL

Plan: Pro

Run ID: 92aa47e9-e699-4eee-aae2-c287c6aab028

📥 Commits

Reviewing files that changed from the base of the PR and between 5e35499 and e8f7d67.

📒 Files selected for processing (3)

.gitignore
website/src/components/anchor-modal.js
website/src/components/anchor-modal.test.js

Walkthrough

Das Pull Request behebt eine Racebedingung bei Anker-Freigabelinks, die beim ersten Besuch dazu führt, dass das Modal nicht geöffnet wird. Die Funktion showAnchorDetails erstellt nun bei Bedarf das Modal-Element und wird durch einen Testfall validiert, der dieses Szenario reproduziert. Zusätzlich werden Gitignore-Einträge für lokale Verzeichnisse hinzugefügt.

Changes

Behebung der Racebedingung bei Anker-Modalen

Layer / Datei(en)	Zusammenfassung
Modal-Initialisierungsicherung und Race-Condition-Handling `website/src/components/anchor-modal.js`, `website/src/components/anchor-modal.test.js`	`showAnchorDetails` verwendet nun ein Fallback `createModal()`, wenn `#anchor-modal` noch nicht vorhanden ist. Ein neuer Testfall validiert dieses Szenario, indem das Modal entfernt wird, die Funktion aufgerufen wird und anschließend überprüft wird, dass das Modal neu erstellt und sichtbar ist.
Entwicklungsumgebungs-Konfiguration `.gitignore`	Gitignore wird um Einträge für `.venv/` und `.linkedin/` erweitert, um lokale Verzeichnisse von der Versionskontrolle auszuschließen.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and specifically describes the main fix: resolving the race condition where share-links to anchors fail to open the modal on first visit.
Linked Issues check	✅ Passed	All code changes directly address issue `#470`: showAnchorDetails() now guards against missing modal elements by calling createModal(), preventing the TypeError and ensuring the modal opens reliably.
Out of Scope Changes check	✅ Passed	All changes are directly scoped to fixing the share-link race condition: .gitignore additions are project housekeeping, anchor-modal.js implements the race-condition fix, and tests verify the solution.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint skipped: no ESLint configuration detected in root package.json. To enable, add eslint to devDependencies.

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

raifdmueller and others added 2 commits May 12, 2026 15:08

chore: ignore .venv/ and .linkedin/

eeb81d4

Both are local-only directories (Python virtualenv and LinkedIn skill cache) that shouldn't be tracked.

rdmueller merged commit d364e45 into LLM-Coding:main May 13, 2026
7 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix: share-link first visit doesn't open anchor modal (#470)#474

fix: share-link first visit doesn't open anchor modal (#470)#474
rdmueller merged 2 commits into
LLM-Coding:mainfrom
raifdmueller:fix/share-link-modal-race-470

raifdmueller commented May 13, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

coderabbitai Bot commented May 13, 2026 •

edited

Loading

❌ Failed checks (1 warning)

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

raifdmueller commented May 13, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Root cause

Fix

Test plan

Summary by CodeRabbit

Bug Fixes

Uh oh!

coderabbitai Bot commented May 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

❌ Failed checks (1 warning)

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

raifdmueller commented May 13, 2026 •

edited by coderabbitai Bot

Loading

coderabbitai Bot commented May 13, 2026 •

edited

Loading